<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" />
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<title></title>
</head>
<body background="../img/tu6.jpg">
	<h1 style="text-align: center;">用户查找TWO</h1>
	<table id='userTable'>
		<thead>
			<tr>
				<th>用户id</th>
				<th>用户名</th>
				<th>密码</th>
				<th>性别</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>101</td>
				<td>张三</td>
				<td>123</td>
				<td>男</td>
			</tr>
			<tr>
				<td>102</td>
				<td>李四</td>
				<td>456</td>
				<td>男</td>
			</tr>
		</tbody>
	</table>
<script>
	var user=[
		{
		"id":"101",
		"name":"张三",
		"password":"123",
		"sex":"男"
		},{
		"id":"102",
		"name":"李思",
		"password":"456",
		"sex":"女"
		},{
		"id":"103",
		"name":"王五",
		"password":"789",
		"sex":"男"
		},{
		"id":"104",
		"name":"赵柳",
		"password":"666",
		"sex":"女"
	}
	]
	
	
	//元素 选择器 '#userTable' class='.' type=''
	var dt=$('#userTable').DataTable({
		//设置data 数据源
		data:user,
		//按类别取出数据
		// ajax{
		// 	url:'user.json'//外置数据源地址
		// 	dataSrc:function(user){
		// 		return user.students;
		// 	}
		// },
		
		columns:[
			{data:'id'},
			{data:'name'},
			{data:'password'},
			{data:'sex'},
		],//设置数据来源
		
		
		
		searching:false,//搜索栏隐藏
		info:true,//信息栏隐藏 false 显示true
		lengthMenu:[2,5,10,15],//设置长度菜单
		// pageLength:1,//写死 页面 长度为 1 单页面显示条目
		paging:true,//设置翻页栏 默认是true
		//设置语言
		language:{
			lengthMenu:'每页显示_MENU_条记录',
			info:'显示_START_至_END_条记录,共_TOTAL_条记录',
			paginate:{
				frist:'首页',
				previous:'上一页',
				next:'下一页',
				last:'末页',
				
			}
		}
		
		
		
	})
	
</script>
</body>
</html>
